<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>校事达校园即时服务平台</title>
    <link rel="stylesheet" href="/layui2_9/css/layui.css">
</head>

<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin">

    <!-- 内容主体区域-->
    <div class="layui-body ">
        <div style="padding: 30px;" class="layui-fluid">
            <div class="layui-row">
                <div class="layui-col-md12">
                    <!-- 标题部分 -->
                    <span class="layui-badge-dot"></span>
                    <span class="layui-badge-dot layui-bg-orange"></span>
                    <span class="layui-badge-dot layui-bg-green"></span>
                    <span class="layui-badge-dot layui-bg-cyan"></span>
                    <span class="layui-badge-dot layui-bg-blue"></span>
                    <span class="layui-badge-dot layui-bg-black"></span>
                    <span class="layui-badge-dot layui-bg-gray"></span>
                    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
                        <legend>任务平台</legend>
                    </fieldset>
                </div>
            </div>

            <!-- 搜索框 -->
            <div class="layui-row">
                <div class="layui-col-md1">&nbsp;</div>
                <div class="layui-col-md10">
                    <form class="layui-form layui-form-pane" lay-filter="formFilter" method="post" action="/admin/search" target="main">
                        <div class="layui-form-item">
                            <!-- 搜索表单项 -->
                            <div class="layui-input-inline">
                                <label class="layui-form-label">学校</label>
                                <div class="layui-input-block" style="width: 250px;">
                                    <input name="school" placeholder="输入选择" class="layui-input" id="ID-dropdown-demo-base-input">
                                </div>
                            </div>

                            <div class="layui-inline">
                                <label class="layui-form-label">价格范围</label>
                                <div class="layui-input-inline" style="width: 40px;">
                                    <input type="text" name="priceMin" placeholder="￥" autocomplete="off" class="layui-input">
                                </div>
                                <div class="layui-form-mid">-</div>
                                <div class="layui-input-inline" style="width: 40px;">
                                    <input type="text" name="priceMax" placeholder="￥" autocomplete="off" class="layui-input">
                                </div>
                            </div>

                            <div class="layui-input-inline">
                                <label class="layui-form-label">任务状态</label>
                                <div class="layui-input-block" style="width: 100px;">
                                    <select id="state" name="status" lay-filter="stateFilter0">
                                        <option value="-1" selected="">请选择</option>
                                        <option value="0">待解决</option>
                                        <option value="1">已关闭</option>
                                        <option value="2">解决中</option>
                                        <option value="3">已完成</option>
                                    </select>
                                </div>
                            </div>

                            <div class="layui-inline">
                                <label class="layui-form-label">关键词</label>
                                <div class="layui-input-block">
                                    <input type="text" name="task_name" autocomplete="off" class="layui-input" value="">
                                </div>
                            </div>

                            <button class="layui-btn" lay-submit="seform" lay-filter="seform">搜索</button>
                        </div>
                    </form>
                </div>
                <div class="layui-col-md1">&nbsp;</div>
            </div>
            <!-- 搜索框结束 -->

            <!-- 任务列表区域 -->
            <div class="layui-row">
                <div class="layui-col-md1">&nbsp;</div>
                <div class="layui-col-md10">
                    <fieldset class="layui-elem-field">
                        <legend>任务</legend>
                        <div class="layui-field-box" style="padding: 30px;">

                            <!-- 排序按钮 -->
                            <div class="layui-row">
                                <div class="layui-col-md12">
                                    <div class="fly-panel-title fly-filter">
                                        <a class="layui-this">任务</a>
                                        <span class="fly-mid"></span>
                                        <span class="fly-filter-right layui-hide-xs" style="float: right">
                                            <a class="layui-this" style="padding-left: 15px;cursor: pointer">时间最新</a>
                                            <a class="layui-this" style="padding-left: 15px;cursor: pointer"><i class="layui-icon layui-icon-up"></i>价格升序</a>
                                            <a class="layui-this" style="padding-left: 15px;cursor: pointer"><i class="layui-icon layui-icon-down"></i>价格降序</a>
                                        </span>
                                    </div>
                                </div>
                            </div>

                            <!-- 任务列表 -->
                            <div class="layui-row">
                                <div class="layui-col-md12">
                                    <ul class="fly-list">
                                        <!-- 任务循环 -->
                                        <li th:each="task:${tasks}" style="padding-left: 15px;cursor: pointer; margin-bottom: 20px;">
                                            <h2>
                                                <a class="layui-badge layui-bg-green" th:text="${task.task_name}">华东政法大学</a>
                                                <a class="layui-badge" th:text="${task.status}">待解决</a>
                                                <br>
                                                <a th:onclick="|getTask(${task.id})|"
                                                   style="cursor: pointer"
                                                   th:text="${task.task_name}">周末清理垃圾</a>
                                            </h2>
                                            <div class="fly-list-info">
                                                <a th:onclick="|getPuser(${task.publisher_id})|">
                                                    <cite th:text="${task.publisher_name}">小灰</cite>
                                                </a>
                                                <span th:text="${task.created_time}">2024-12-18 19:06:37</span>
                                                <span class="fly-list-kiss layui-hide-xs" th:text="${task.reward}">
                                                    <i class="layui-icon">&#xe65e;</i>
                                                    <span th:text="${task.reward}">5.0</span>
                                                </span>
                                                <span class="fly-list-nums">
                                                    <i class="layui-icon">&#xe62c;</i>
                                                </span>
                                            </div>
                                        </li>
                                        <!-- 任务循环结束 -->
                                    </ul>
                                </div>
                            </div>

                            <!-- 分页栏 - 放在任务列表外部 -->
                            <div class="layui-row" style="margin-top: 20px;">
                                <div class="layui-col-md12" style="text-align: center;">
                                    <div id="test1"></div>
                                </div>
                            </div>

                        </div>
                    </fieldset>
                </div>
                <div class="layui-col-md1">&nbsp;</div>
            </div>
            <!-- 任务列表区域结束 -->

        </div>
    </div>

    <div class="layui-footer" align="center">
        © - 联系校事达官方客服：6666666
    </div>
</div>
<script src="/layui2_9/layui.js"></script>
<script>
    // 一次性加载所有需要的模块
    layui.use(['layer', 'laypage', 'form', 'dropdown'], function(){
        var layer = layui.layer;
        var laypage = layui.laypage;
        var form = layui.form;
        var dropdown = layui.dropdown;

        // 设置为全局变量
        window.layer = layer;

        // 分页配置
        laypage.render({
            elem: 'test1',
            count: 100,
            limit: 10,
            curr: 1,
            layout: ['count', 'prev', 'page', 'next', 'limit', 'skip'],
            jump: function (obj, first) {
                if (!first) {
                    var currentPage = obj.curr;
                    console.log('跳转到第', currentPage, '页');
                }
            }
        });

        // 定义全局函数
        window.getPuser = function(id) {
            layer.open({
                type: 2,
                title: '该用户信息',
                shadeClose: true,
                shade: false,
                area: ['1000px', '600px'],
                content: '/admin/userInfo?id=' + id
            });
        };

        window.getTask = function(id) {
            console.log('getTask函数被调用，ID:', id);
            layer.open({
                type: 2,
                title: '该任务信息',
                shadeClose: true,
                shade: false,
                area: ['1000px', '600px'],
                content: '/admin/findByTask?id=' + id
            });
        };
    });
</script>
</body>
</html>